<div ng-controller="CrossCtrl as vm">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-warning">
                <div class="box-header with-border">
                    <h3 class="box-title">Cross/Exposure Training</h3>
                    <small class="text-warning">{{vm.msg}}</small>
                    <button ng-disabled="!vm.editable|| vm.loading" class="btn btn-danger btn-xs pull-right" ng-click="vm.saveTable()"><i class="fa fa-check-square-o"></i>Submit</button>
                </div>
                <div class="box-body table-responsive no-padding" style="height:650px">
                    <table class="table table-hover">
                        <form class="form-inline">
                            <table class="table table-bordered table-condensed">
                                <tr>
                                    <th>Name of Pax</th>
                                    <th>Dept. of Pax</th>
                                    <th>Training Date</th>
                                    <th>Receiving Hotel</th>
                                    <th>Reason to Cancell/Postpone</th>
                                </tr>
                                <tr ng-repeat="ret in vm.result">
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.name" ng-change="vm.rowCheck()" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.depart" ng-change="vm.rowCheck()"/>
                                    </td>
                                    <td width="150px">
                                        <span class="input-group">
                                          <input type="text" ng-disabled="!vm.editable" class="form-control" uib-datepicker-popup ng-model="ret.date" is-open="ret.opened" datepicker-options="dateOptions" max-date="maxDate" ng-required="true" close-text="Close"  ng-change="vm.rowCheck()" readonly/>
                                          <span class="input-group-btn">
                                            <button type="button" class="btn btn-default" ng-click="open(ret,$event)" ng-disabled="!vm.editable"><i class="glyphicon glyphicon-calendar"></i></button>
                                          </span>
                                        </span>
                                    </td>
                                    <td>
                                          <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.jiudian" ng-change="vm.rowCheck()"/>
                                    </td>
                                    <td>
                                         <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.reason" ng-change="vm.rowCheck()"/>
                                    </td>
                                    <td><a ng-if="$index!=0 && vm.editable" ng-click="vm.remove(vm.result, $index)"><i class="fa fa-close"></i></a></td>
                                   
                                </tr>
                                <tr><td><a ng-click="vm.add()"><i class="fa fa-plus"></i></a></td></tr>
                            </table>
                        </form>
                    </table>
                </div>
                <!-- /.box-body -->
            </div>
            <!-- /.box -->
        </div>
    </div>
</div>
